﻿@model IEnumerable<EC_ASS.Models.Order>

@{
    ViewBag.Title = "Order";
    Layout = "~/Views/Shared/_AdminLayout.cshtml";
}

<!--Edit modal-->
<div>
    <div id='editModal' class='modal hide fade in' style="overflow-y: auto;">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h3>Thông tin</h3>
        </div>
        <div id='editModalContent'></div>
        <div id="editLoading" style="margin-top: 20px; margin-bottom: 20px;">
            <center>
                <img src="@Url.Content("~/img/ajax-loader.gif")" />
            </center>
        </div>
    </div>
</div>

<!--Detail modal-->
<div>
    <div id='detailModal' class='modal hide fade in'>
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h3>Thông tin</h3>
        </div>
        <div id='detailModalContent'></div>
        <div id="detailLoading" style="margin-top: 20px; margin-bottom: 20px;">
            <center>
                <img src="@Url.Content("~/img/ajax-loader.gif")" />
            </center>
        </div>
    </div>
</div>
<script type="text/javascript">
    $(function () {
        $('.edit-order').click(function () {
            var itemID = $(this).attr('orderID');
            var editUrl = this.href + '/' + itemID;
            $('#editModalContent').load(editUrl, function () {
                $('#editModal').modal({
                    backdrop: 'static',
                    keyboard: true
                }, 'show');
                $('#editLoading').hide();
            });
            return false;
        });

        $('.view-detail').click(function () {
            var itemID = $(this).attr('order-ID');
            var detailUrl = this.href + '/' + itemID;
            $('#detailModalContent').load(detailUrl, function () {
                $('#detailModal').modal({
                    backdrop: 'static',
                    keyboard: true
                }, 'show');
                $('#detailLoading').hide();
            });
            return false;
        });

        // Close detail modal and update orders
        $('#detailModal').on('hidden', function () {
            $.ajax({
                url: '@Url.Action("_LoadOrder", "Admin")',
                type: "GET",
                success: function (data) {
                    $('#listOrderTable').fadeOut(1500, function () {
                        $('#listOrderTable').html(data);
                        //fade in with new content
                        $("#listOrderTable").fadeIn(1500);
                    });
                }
            });
        })

        $('.delete-order').click(function () {
            var orID = $(this).attr('orderID');
            var deleteUrl = this.href;
            $.ajax({
                type: "GET",
                url: deleteUrl,
                data: { id: orID },
                success: function (result) {
                }
            });
            setTimeout(function () {
                $('#listOrderTable').load('@Url.Action("_LoadOrder", "Admin")').hide().fadeIn('slow');
            }, 2000);
            return false;
        });
    });
</script>
<div id="listOrderTable">
    <table class="table table-bordered">
        <thead>
            <th>Chi tiết</th>
            <th>Khách mua</th>
            <th>Khách nhận</th>
            <th>Số điện thoại</th>
            <th>Ngày đặt hàng</th>
            <th>Tổng giá trị</th>
            <th>Phí chuyển</th>
            <th>Trạng thái</th>
            <th>Thao tác</th>
        </thead>
        <tbody>
            @foreach (var item in Model)
            {
                <tr class="success">
                    <td><a href="@Url.Action("OrderDetail", "Admin")" class="btn view-detail" order-ID="@item.ID">Xem chi tiết</a></td>
                    <td>@item.Buyer</td>
                    <td>@item.Receiver</td>
                    <td>@item.ShipPhone</td>
                    <td>@item.OrderDate</td>
                    <td>@item.Total</td>
                    <td>@item.ShipFee</td>
                    @if (item.CheckedOut)
                    {
                        <td><span class="label label-success">Đã duyệt</span></td>
                    }
                    else
                    {
                        <td><span class="label label-warning">Chưa duyệt</span></td>
                    }
                    <td>
                        @Html.ActionLink("Sữa", "UpdateOrder", "Admin", null, new { @class = "btn edit-order", @orderID = item.ID })
                        @Html.ActionLink("Xóa", "DeleteOrder", "Admin", null, new { @class = "btn delete-order", @orderID = item.ID })
                    </td>
                </tr>
            }
        </tbody>
    </table>
</div>



